<%@ page contentType="text/html; charset=UTF-8"%>
<%@page import="edu.ccut.saturn.component.SaturnData"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<%@ include file="/extjs/include/all.jsp"%>
<title></title>
<script type="text/javascript">
Ext.onReady(function(){
	var resultWidth = Ext.get("east").getWidth();
	var proDefId = new Ext.form.Hidden({  
			   id:'process_define_id',
               name:'process_define_id'
           });  
	var sm = new Ext.grid.CheckboxSelectionModel();
	var cm = new Ext.grid.ColumnModel([
	    new Ext.grid.RowNumberer(),
	    sm, 
	   {header: "流程ID",width:resultWidth*0.07, dataIndex: 'process_instance_id', sortable: true},
       {header: "名称", width:resultWidth*0.08, dataIndex: 'name', sortable: true},
       {header: "状态",width:resultWidth*0.05, dataIndex: 'state', sortable: true,renderer:showState},
       {header: "是否超时", width:resultWidth*0.09,dataIndex: 'is_timeout', sortable: true,renderer:showIsTimeout},
       {header: "优先级",width:resultWidth*0.08, dataIndex: 'priority', sortable: true},
       {header: "创建者",width:resultWidth*0.08, dataIndex: 'creator', sortable: true},
       {header: "开始时间",width:resultWidth*0.14,dataIndex: 'start_time', sortable: true},
       {header: "完成时间",width:resultWidth*0.14, dataIndex: 'end_time', sortable: true}
	 ]); 
	cm.defaultSortable = true; 
	var store = new Ext.data.JsonStore({
		    url: '${pageContext.request.contextPath}/edu.ccut.saturn.workflow.manager::/proInstMgrModule/action/QueryProInstList.action',
		    root: 'result',
		    totalProperty:'count',
		    fields: [
	               {name: 'process_instance_id', mapping: 'process_instance_id'},
	               {name: 'name', mapping: 'name'},
	               {name: 'state', mapping: 'state'}, 
	               {name: 'is_timeout', mapping: 'is_timeout'}, 
	               {name: 'priority', mapping: 'priority'}, 
	               {name: 'creator', mapping: 'creator'}, 
		    	   {name: 'start_time', mapping: 'start_time'},
	               {name: 'end_time', mapping: 'end_time'}
	           ]
		});
		
		  store.on('beforeload',function(){
		    		var process_define_id=proDefId.getValue();
				 	Ext.apply(this.baseParams,{process_define_id:process_define_id});
		  });

		var grid = new Ext.grid.GridPanel({
					    frame:true,
					    bodyStyle:'width:100%',
					    title:'该版本下的流程实例列表',
			       	    store: store,
					    sm:sm,
					    cm:cm,
				        renderTo:document.body,
				        height:500,
				        width:resultWidth*0.8,
				        frame:true,
				        loadMask: {msg:'正在加载数据，请稍侯……'},
				        tbar: [{
					            text:'同步版本',
					            tooltip:'同步到当前有效版本版本',
					            iconCls:'add',
					            handler: function(){
					            	var arr_Records = sm.getSelections();
					            	if(arr_Records==null||arr_Records.length==0){
					            		Ext.MessageBox.show({
										    title:"提示",
										    msg:"选择需要升级的流程实例",
										    buttons:{"ok":"关闭"},
										    width:200,
										    icon:Ext.MessageBox.INFO,
										    closable:false,
										    progress:false,
										    wait:false
										});
					            		
					            		return false;
					            	}
					            	var proInstIdList = "";
					            	for(var i=0;i<arr_Records.length;i++){
					            		proInstIdList += arr_Records[i].data.process_instance_id+",";
					            	}
					            	proInstIdList = proInstIdList.substring(0,proInstIdList.length-1);
					               var process_define_id=proDefId.getValue();
					               Ext.Ajax.request({
									     method : 'POST',                           
									     url: '${pageContext.request.contextPath}/edu.ccut.saturn.workflow.manager::/proInstMgrModule/action/SynchVersion.action',     
									     success:function(request){    
									       store.load({params: {start:0,limit:20,process_define_id:proDefId.getValue()}});              
									       var myResult = Ext.util.JSON.decode(request.responseText);
									       Ext.Msg.alert('信息',myResult.message);        
									     },
									     failure:function(){                          
									       Ext.Msg.alert("错误", "与后台联系的时候出现了问题");
									     },
									     params:{
									     		proInstIds:proInstIdList, 
									     		process_define_id:process_define_id
									     } 
							     	});
					            }

      					}],
      					  bbar: new Ext.PagingToolbar({ 
					            pageSize: 20, 
					            store: store, 
					            displayInfo: true, 
					            displayMsg: '当前显示 {0} - {1}条记录 /共 {2}条记录',
					            emptyMsg: "没有数据显示" 
		    			}) 
			    });
			    
			    var root=new Ext.tree.AsyncTreeNode({
					id:"root",
					text:"流程实例管理"});
				var proInstTree=new Ext.tree.TreePanel({
					title:'主菜单',
					id:'saturn-tree',
					autoScroll:true,
					enableDD:false,
					containerScroll: true,
					root:root,
					loader: new Ext.tree.TreeLoader({url:'${pageContext.request.contextPath}/edu.ccut.saturn.workflow.manager::/proInstMgrModule/action/GetVersionTree.action'})
				});	
		
			proInstTree.on('click', function(node){
					if(!node.isLeaf()){   
			            return false;   
			        }
					queryProInstList(node.id);
				},this);
				
		var saturnMain = new Ext.Viewport({
	        layout:'border',
			items:[
			new Ext.BoxComponent({ 
					region:'center',
					el: 'center',
					items:[grid]
				}),
				{
					region:'east',
					id:'east',
					title:'流程实例管理',
					split:true,
					width: resultWidth*0.2,
					collapsible:false,
					layout:'accordion',
					collapsed:false,
					layoutConfig:{
						animate:false
					},
					items:[proInstTree]
				}
			]
		});
		
		function queryProInstList(process_define_id){
			proDefId.setValue(process_define_id);
			store.load({params: {start:0,limit:20,process_define_id:process_define_id}});
		}		
		
		function showState(value){
			if(value=="2"){
				return "运行";
			}else{
				return "完成";
			}
		}
		
		function showIsTimeout(value){
			if(value=='Y'){
				return "是";
			}else{
				return "否";
			}
		}
})
</script>
</head>
<body>
<div id='center' width='100%'></div>
<div id='east' width='100%'></div>
</body>
</html>